<template>
	<view class="totle" style="position: relative;">
		<view class="search2-top">
			<view class="search2-top-left" @click="backFn">
				<image class="search2-top-left-img" src="../../../static/images/search1/back.png" mode=""></image>
			</view>
			<view class="search" @click="backSearch">
				<image class="search-img" src="../../static/images/realestate/cha@3x.png" mode=""></image>
			</view>
			<view class="search2-top-center">
				婚姻登记信息查询
			</view>
			<view class="search2-top-right">
				<image class="search2-top-right-img" src="../../static/images/marriage/Frame26@3x.png" mode=""></image>
			</view>
		</view>

		<view class="table" v-if="userInfo.card==info.number_w">

			<table class="table-b">
				<tr height="50rpx">
					<td width="21%" style="text-align: center; padding: 0 10rpx;">登记类型</td>
					<td width="21%" v-if="info.cid==3">结婚登记</td>
					<td width="21%" v-if="info.cid==4">离婚登记</td>
					<td width="21%" style="text-align: center;">登记日期</td>
					<td width="37%">{{info.dengji_time}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">姓名</td>
					<td>{{info.name_w}}</td>
					<td style="text-align: center;">证件号码</td>
					<td style="padding-right: 10rpx;">{{info.number_w}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">姓名</td>
					<td>{{info.name_m}}</td>
					<td style="text-align: center;">证件号码</td>
					<td style="padding-right: 10rpx;">{{info.number_m}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">登记信息<br>录入机关</td>
					<td colspan="3">{{info.jiguan}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">证书附录</td>
					<td colspan="3">无</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">其他备注</td>
					<td colspan="3">无</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">查询时间</td>
					<td colspan="3">
						{{nian}}
						{{ri}}
					</td>
				</tr>
			</table>

		</view>
		<view class="table" v-if="userInfo.card==info.number_m">

			<table class="table-b">
				<tr height="50rpx">
					<td width="21%" style="text-align: center; padding: 0 10rpx;">登记类型</td>
					<td width="21%" v-if="info.cid==3">结婚登记</td>
					<td width="21%" v-if="info.cid==4">离婚登记</td>
					<td width="21%" style="text-align: center;">登记日期</td>
					<td width="37%">{{info.dengji_time}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">姓名</td>
					<td>{{info.name_m}}</td>
					<td style="text-align: center;">证件号码</td>
					<td style="padding-right: 10rpx;">{{info.number_m}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">姓名</td>
					<td>{{info.name_w}}</td>
					<td style="text-align: center;">证件号码</td>
					<td style="padding-right: 10rpx;">{{info.number_w}}</td>
				</tr>

				<tr height="50rpx">
					<td style="text-align: center;">登记信息<br>录入机关</td>
					<td colspan="3">{{info.jiguan}}</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">证书附录</td>
					<td colspan="3">无</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">其他备注</td>
					<td colspan="3">无</td>
				</tr>
				<tr height="50rpx">
					<td style="text-align: center;">查询时间</td>
					<td colspan="3">
						{{nian}}
						{{ri}}
					</td>
				</tr>
			</table>
			
		</view>
		<view style="position: relative;z-index: 999;top:-450rpx;left:50rpx;color: #b1a6a5;" class="shuiyin">
			<rich-text :nodes="aa+'<br>'+ri"></rich-text>
		</view>
		<!-- <zmm-watermark :watermark="aa+'<br>'+ri"></zmm-watermark> -->
		<view class="tip-zong">
			<view>
				温馨提示：
			</view>
			<view v-for="item in tip">
				<view>
					{{item.value}}
				</view>
			</view>
		</view>
		<view class="back" @click="backFn">
			返回
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app'
	import {
		getUserInfo,
		getTip
	} from '@/api/user'

	import {
		storeToRefs
	} from 'pinia'
	import {
		useUserStore
	} from '@/stores/user'
	const userStore = useUserStore()
	const {
		userInfo
	} = storeToRefs(userStore)
	onShow(() => {
		userStore.getUser()
		console.log(userInfo.value, 'userInfo');
	})
	const info = ref({})
	const info1 = ref({})


	onShow(() => {
		getTime();
	})

	onLoad((options) => {
		// info.value ={}
		info.value = JSON.parse(decodeURIComponent(options.params));
		console.log(info.value, '77777777777777');
		getTipFn()
	})
	const getinfo1 = async () => {
		const data = await getUserInfo()
		info1.value = data
	}

	const backFn = () => {
		uni.navigateBack(-1)
	}
	const backSearch = () => {
		uni.navigateTo({
			url: '/pages/search/search1'
		})
	}

	const tip = ref({})
	const getTipFn = () => {
		getTip().then(res => {
			tip.value = res
			console.log(res, 'ttttttttttttttttttt');
		})
	}


	const watermark = ref('')
	const showInfo = ref('0')
	const nian = ref('')
	const ri = ref('')
	const aa = ref('')
	const getTime = () => {
		let date1 = new Date();
		let year = date1.getFullYear();
		let month = date1.getMonth();
		let day = date1.getDate();
		let xinqi = date1.getDay();
		// let hh = date1.getHours();
		let hh = date1.getHours()< 10 ? '0' + date1.getHours() : date1.getHours();
		let mm = date1.getMinutes() < 10 ? '0' + date1.getMinutes() : date1.getMinutes();
		let ss = date1.getSeconds() < 10 ? '0' + date1.getSeconds() : date1.getSeconds();
		// console.log(ss,'ss1111111');
		//let date = year + "年" + (month + 1) + "月" + day + "日   星期" + xinqi + "  " + hh + ":" + mm + ":" + ss
		let date2 = year + '.' + (month + 1) + '.' + day + ' ';
		let date = year + '年' + (month + 1) + '月' + day + '日';
		//let  week = "星期" +xinqi //星期6
		let realTime = hh + ':' + mm + ':' + ss;
		nian.value = date;
		aa.value = date2
		ri.value = realTime
		// const watermark= `${date2}+<br>+${realTime}`
	};
</script>

<style scoped lang="scss">
	.totle {
		background-color: #fff;
		width: 100%;
		height: 100vh;
	}

	.search2-top {
		height: 184rpx;
		background: #FFFFFF;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		opacity: 1;
		padding-top: 96rpx;
		display: flex;

		.search2-top-left {
			width: 10%;

			.search2-top-left-img {
				width: 88rpx;
				height: 88rpx;
			}
		}

		.search {
			width: 10%;

			.search-img {
				width: 88rpx;
				height: 88rpx;
			}
		}

		.search2-top-center {
			font-size: 34rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #333333;
			width: 65%;
			padding-left: 38rpx;
			line-height: 88rpx;
		}

		.search2-top-right {
			width: 15%;
			display: flex;

			.search2-top-right-img {
				width: 80rpx;
				height: 80rpx;
			}

		}

	}

	.table {
		width: 92%;
		margin-left: 4%;
		margin-top: 30rpx;
		margin-bottom: 10rpx;
		background-color: #fff;
		background-image: url('https://www.zuoxinfangqiye.cn/static/shuiyin.png');
		// background-position: center top;
		background-position: right top;
		// background-size: 100% 90%;
		background-size: 92%;
		background-repeat: no-repeat;
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		
		.table-b {
			border-collapse: collapse;
			td,
			th {
				
				border: 1px solid #ccc;
				// height: 40rpx;
				word-wrap: break-word;
				word-break: break-all;
			}
		}
	}

	.back {
		width: 92%;
		margin-left: 4%;
		margin-top: 56rpx;
		text-align: center;
		line-height: 84rpx;
		height: 84rpx;
		background: #1477FF;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;

	}

	.tip-zong {
		width: 92%;
		margin-left: 4%;
		// margin-top: 10rpx;
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC;
		// font-family: '宋体';
		font-weight: 600;
		line-height: 40rpx;
	}
	.shuiyin{
		transform:rotate(-45deg);
		// color:#000;

	}
</style>